<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div>
        <span>sapn</span>
        <span>sapn</span>
        <span>sapn</span>
    </div>
    <button class="add">添加节点</button>
    <button class="del">删除节点</button>
    <script>
        document.querySelector('.add').addEventListener('click',function(){
            //添加a 标签
            const a= document.createElement('a')
            //设置内容
            a.innerHTML='西红柿炒鸡蛋'
            a.href='https://www.baidu.com'
//创建节点
const body=document.querySelector('body')
//可以在结尾添加
//body.append(a)
//在前面添加
body.prepend(a)

        })


document.querySelector('.del').addEventListener('click',function(){
    //自己删除自己
   // this.remove()

   //删除body
//document.querySelector('body').remove()

//找到所有的span 删除
const spanArr = document.querySelectorAll('span')
        //  spanArr.forEach(item => {
        //    item.remove()
        //  })

         // 每隔一秒钟，删掉一个
         spanArr.forEach((item, index) => {
          setTimeout(() => {
            item.remove()
          }, (index + 1) * 1000)
        })
})






    </script>
</body>
</html>